<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/jquery-1.11.3.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <link href="css/base.css" rel="stylesheet"/>
    <link href="css/index.css" rel="stylesheet"/>
    <script>
        var i=1;
        var s;
        function changeProduct(){
            if(i==1){
                $(".productList ul").eq(0).hide();
                $(".productList ul").eq(1).fadeIn(500);
                i=0;
            }else{
                $(".productList ul").eq(1).hide();
                $(".productList ul").eq(0).fadeIn(500);
                i++;
            }
        }
        function start(){
            s=setInterval(changeProduct,3000);
        }
        function end(){
            clearInterval(s);
        }
        $(function(){
            start();
            $(".productList ul").eq(1).hide();
            $(".productList").mouseenter(function(){
                end();
            }).mouseleave(function(){
                start();
            })
        })

    </script>
</head>
<body>
<div class="both">
    <div class="header">
        <div class="container">
            <div class="nav">
                <p>
                	<c:if test="${LoginUser==null}">
                    <a href="login.html" >登陆</a>&nbsp;&nbsp;
                    </c:if>
                    <c:if test="${LoginUser!=null}">
                    <a>${LoginUser.userName},欢迎你！</a>&nbsp;&nbsp;|&nbsp;&nbsp;
                    <a href="cart.html">我的购物车</a>&nbsp;&nbsp;|&nbsp;&nbsp;
                    <a href="login.html?out=t">注销</a>&nbsp;&nbsp;
                    </c:if>
                    |&nbsp;&nbsp;
                    <a href="register.html" >注册</a>
                </p>
                <p>|&nbsp;符合人类进步的食品</p>
                <p>
                    <a>首页</a>&nbsp;&nbsp;|&nbsp;&nbsp;
                    <a href="productList.html">蛋糕名录</a>&nbsp;&nbsp;|&nbsp;&nbsp;
                    <a href="user.html">用户中心</a>
                </p>
            </div>
        </div>
    </div>
    <div class="Navigation">
        <ul>
            <li style="border-left: 1px solid darkkhaki"><a href="">首页</a></li>
            <c:forEach var="c" items="${categories}">
            	<li><a href="productList.html?cid=${c.id}">${c.name}</a></li>
            </c:forEach>
            <li><a href="">公司简介</a></li>
        </ul>
    </div>
    <div class="main">
        <div class="banner">
            <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                <ol class="carousel-indicators">
                    <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                    <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                </ol>
                <div class="carousel-inner" role="listbox">
                    <div class="item active">
                        <a href="productList.html?cid=2"><img src="image/index-image/hengfu.jpg"  alt="..."></a>
                    </div>
                    <div class="item">
                        <a href="productList.html?cid=5"><img src="image/index-image/hengfu1.jpg"  alt="..."></a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="main">
        <div class="productList">
            <ul>
                <li><a href="productList.html?cid=1"><img src="image/index-image/cake1.jpg" alt=""/></a></li>
                <li><a href="productList.html?cid=1"><img src="image/index-image/cake2.jpg" alt=""/></a></li>
                <li><a href="productList.html?cid=1"><img src="image/index-image/cake3.jpg" alt=""/></a></li>
                <li><a href="productList.html?cid=1"><img src="image/index-image/cake4.jpg" alt=""/></a></li>
            </ul>
            <ul>
                <li><a href="productList.html?cid=3"><img src="image/index-image/cake5.jpg" alt=""/></a></li>
                <li><a href="productList.html?cid=3"><img src="image/index-image/cake6.jpg" alt=""/></a></li>
                <li><a href="productList.html?cid=3"><img src="image/index-image/cake7.jpg" alt=""/></a></li>
                <li><a href="productList.html?cid=3"><img src="image/index-image/cake8.jpg" alt=""/></a></li>
            </ul>
        </div>
        <div class="hot_sole">
            <a href="productList.html"><img src="image/index-image/hot_sole2.jpg" class="productbanner" width="100%" alt=""/></a>
            <div class="hot_sole_productlist">
                <ul>
                    <li><a href="productList.html?cid=2"><img src="image/index-image/hotcake1.png" alt=""/></a></li>
                    <li><a href="productList.html?cid=2"><img src="image/index-image/hotcake2.png" alt=""/></a></li>
                    <li><a href="productList.html?cid=2"><img src="image/index-image/hotcake3.png" alt=""/></a></li>
                    <li><a href="productList.html?cid=2"><img src="image/index-image/hotcake4.png" alt=""/></a></li>
                </ul>
            </div>
        </div>
        <div class="newproduct">
            <a href="productList.html"><img src="image/index-image/newproduct.jpg" class="productbanner" width="100%" alt=""/></a>
            <div class="newproduct_productlist">
                <ul>
                    <li><a href="productList.html?cid=4"><img src="image/index-image/newcake1.png" alt=""/></a></li>
                    <li><a href="productList.html?cid=4"><img src="image/index-image/newcake2.png" alt=""/></a></li>
                </ul>
            </div>
        </div>
        <div class="fruitproduct">
            <a href="productList.html"><img src="image/index-image/fruitbanner.jpg" class="productbanner" width="100%" alt=""/></a>
            <div class="fruitproduct_productlist">
                <ul>
                    <li><a href="productList.html?cid=5"><img src="image/index-image/fruitcake1.jpg" alt=""/></a></li>
                    <li><a href="productList.html?cid=5"><img src="image/index-image/fruitcake2.jpg" alt=""/></a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="footer">
        <hr>
        <div>
            <p>©2005-2014&nbsp;21Cake官网版权所有，并保留所有权利</p>
            <ul>
                <li><a href="#">联系我们</a> &nbsp;</li>
                <li><a href="#">售后流程</a> &nbsp;</li>
                <li><a href="#">订购方式</a> &nbsp;</li>
            </ul>
        </div>
    </div>
</div>
</div>
</body>
</html>